import React, { Component } from 'react';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';

class Clock extends Component {
    constructor(props) {
        super(props);
        this.state = {
            times: 0
        }

    }
    clock(action) { //  接收时长限制设置  {TIMESLOT：时间} 默认为秒
        let time = this.state.times;
        if (action) {
            time = action.TIMESLOT;
            this.setState({ times: action.TIMESLOT });
        }
        const data = this.props.cardData;
        global.timer1 = setInterval((e) => {
            time--;
            if (time < 0) {
                clearInterval(global.timer1);   
                this.setState({
                    times: 60
                });
                console.log("数据请求返回的成功标志 - postDataResult")
                console.log(data.postDataResult)
                if (data.postDataResult === '0') {
                    // 完成操作   发卡
                    this.props.dispatch({
                        type: 'cardProcess/sendCard',
                    })
                }
                this.props.dispatch(routerRedux.push('/'));
                return false;
            }
            this.setState({
                times: time
            });
        }, 1000);
    }
    componentWillMount() {
        this.setState({ times: 60 });
        global.clock = this.clock.bind(this)
    }

    componentWillUnmount() {
        clearInterval(global.timer1);
        this.props.dispatch({
            type: 'clock/change',
            payload: {
                visible: false
            }
        })
    }
    render() {
        const { data } = this.props;
        return (
            <div>
                {
                    data.visible ?
                        <div style={{ width: 74, height: 74, borderRadius: 37, textAlign: 'center', lineHeight: "74px", fontSize: '46px', color: '#fff' }}>
                            {this.state.times}
                        </div>
                        :
                        ''
                }
            </div>
        )
    }
}

function mapStateToProps(state) {
    const data = state.Timer;
    const cardData = state.cardProcess;
    return { data, cardData };
}
export default connect(mapStateToProps)(Clock);